<template>
    <div>
        <header class="resviseTop">
            <img src="../../images/left.png" alt="" onClick="javascript :history.back(-1);">
            <span class="resvise_title">提现</span>
        </header>
        <transition name="fade">
            <div class="bg_fff" v-if="tasks.withdraw_buttons">
                <div class="money-end">
                    <p class="clearfix">当前余额金币 <span>{{ users.user_balance }}</span></p>
                </div>
                <div class="user-open">
                    <div class="top_zhanghao">
                            <img src="../../img_myself/wx.png" alt="" class="wximg">
                            <div>
                                <span>账号</span>
                                <p>{{ users.user_mobile }}</p>
                            </div>
                            <div>
                                <span>微信</span>
                                <p v-if="users.user_open_id">{{ users.user_open_id }}</p>
                                <p v-else>未绑定</p>
                            </div>
                            <img src="../../img_myself/bang.png" alt="" class="R_img"  v-if="users.user_open_id">
                    </div>
                </div>
                <!--<div v-else  class="top_zhanghao" >-->
                <!--<img src="../../img_myself/wx.png" alt="" class="wximg">-->
                <!--<button>立即绑定</button>-->
                <!--<div>-->
                <!--<span>账号</span>-->
                <!--<p>{{ users.user_mobile }}</p>-->
                <!--</div>-->
                <!--<img src="../../img_myself/border.png" alt="" class="left_border">-->
                <!--<img src="../../img_myself/border.png" alt="" class="right_border">-->
                <!--</div>-->
                <div class="change_Money">
                    <ul>
                        <li v-for="(arr,index) in tasks.withdraw_buttons" :class="{'active':clicked==arr}"
                            @click="Change_Click(arr)"><img src="@/images/txicon.png" alt="">{{arr}} 元
                        </li>
                    </ul>
                    <!--<p>可提现余额 {{ users.user_balance }} 金币</p>-->
                </div>
                <div class="Put_money">
                    <div class="putBtn">
                        <div @click="PutMoneyBtn">立即提现</div>
                        <p @click="putMoney">提现记录</p>
                    </div>
                    <div class="rule">
                        <p>提现规则</p>
                        <ul>
                            <li><textarea name="" id=" " cols="30" rows="10" :value="tasks.withdraw_rules"
                                          disabled="disabled"></textarea></li>
                            <li><img src="https://wyrq-2.oss-cn-shanghai.aliyuncs.com/admin/20190123/imfKic123.png" alt="" v-if="inviteQrcode"></li>
                        </ul>
                    </div>
                </div>
            </div>
        </transition>

    </div>
</template>

<script>
    import api from '../../utils/api';

    import {MessageBox} from 'mint-ui'

    export default {
        name: "putMoney",
        data(){
            return {
                clicked: 5,   //标识，初始化默认选中第一项
                tasks: [],
                users: [],
                inviteQrcode: ''
            }
        },
        methods: {
            Change_Click: function (index) {
                this.clicked = index
            },
            PutMoneyBtn: function () {
                var _that = this;
                // MessageBox.prompt('请输入提现密码',{inputType: 'password',showCancelButton: true}).then(({ value, action }) => {
                //     if(isNaN(value) || value.length != 6) {
                //         _that.$toast('请输入正确密码')
                //         return false;
                //     }
                //
                // });
                MessageBox.confirm('确定要申请提现吗?').then(action => {
                    var params = {
                        withdraw_amount: _that.clicked,
                        payment_id: 1,
                    }
                    api.request('/capitals/withdraw', 'post', params).then((resp) => {
                        _that.$toast('申请提现成功')
                        api.request('/user', 'get', {}).then((resp) => {
                            _that.users = resp.data.data;
                        })
                    })
                });

                // if (Math.round(this.put_money * 100) / 100 <= Math.round(this.Myselfmoney * 100) / 100) {
                //     alert('提现成功')
                // } else {
                //     alert('提现失败')
                // }
            },
            putMoney: function () {
                this.$router.push({
                    name: 'Commission',
                    params: {
                        num: 2
                    }
                })
            },
        },
        mounted() {
            document.body.scrollTop = 0;

        },
        created() {
            var that = this;
            api.request('/inviteQrcode', 'get', {}).then(function (res) {
                that.inviteQrcode = res.data.data
            })
            api.request('/common', 'get', {}).then((resp) => {
                this.tasks = resp.data.data
            })
            api.request('/user', 'get', {}).then((resp) => {
                this.users = resp.data.data
                this.clicked = this.users.withdraw_buttons[0]
            })

        }
    }
</script>

<style scoped="css">
    @import "../../style/putMoney.css";
</style>
